<template>

  <el-table
    header-cell-class-name="table-header"
    :data="tableData"
    border
    size="medium"
  >
    <el-table-column
      :show-overflow-tooltip="true"
      header-align="center"
      label="推荐代理编号"
      prop="agentNo"
    />
    <el-table-column
      :show-overflow-tooltip="true"
      header-align="center"
      label="代理商名称"
      prop="agentName"
    >
      <template #default="{row}">
        <span v-if="row.agentType == 'agent'">{{ row.agentName }}</span>
        <span v-else>{{ row.userName }}</span>
      </template>
    </el-table-column>
    <el-table-column
      :show-overflow-tooltip="true"
      align="center"
      label="统一社会信用代码"
      prop="socialCreditNo"
      :min-width="140"
    />
    <el-table-column
      :show-overflow-tooltip="true"
      align="center"
      label="企业所在地区"
      prop="region"
    >
      <template #default="{row}">
        <span v-if="row.agentType == 'agent'">{{ row.provinceName }}/{{ row.cityName }}/{{ row.areaName }}</span>

      </template>
    </el-table-column>
    <el-table-column
      :show-overflow-tooltip="true"
      align="center"
      label="详细地址"
      prop="address"
    />
    <el-table-column
      :show-overflow-tooltip="true"
      align="center"
      label="创建时间"
    >
      <template #default="{row}">
        {{ dateFormat("yyyy-mm-dd HH:MM", row.createdAt) }}
      </template>
    </el-table-column>
    <el-table-column
      :show-overflow-tooltip="true"
      align="center"
      label="创建人"
    >
      <template #default="{row}">
        {{ row.creatorName }}
      </template>
    </el-table-column>
    <el-table-column
      :show-overflow-tooltip="true"
      align="center"
      label="状态"
      prop="terminalStatus"
    >
      <template #default="{row}">
        {{ getLabel('recommend_status', row.reAgentStatus) }}
      </template>
    </el-table-column>
  </el-table>

</template>

<script>
import {
  defineComponent,
  getCurrentInstance,
  inject,
  reactive,
  toRefs,
  watch,
} from 'vue'

export default defineComponent({
  name: 'RecommendView',
  props: {
    datas: {
      type: Object,
      default: {},
    },
  },
  setup(props, {}) {
    const currentInstance = getCurrentInstance()
    const api = inject('api')
    var data = reactive({
      tableData: [],
    })

    const getData = () => {
      const a = {
        page: 1,
        pageSize: 100,
        planDetailId: props.datas.planDetail.id,
      }
      api.plan
        .REAGENT_LIST(a)
        .then((res) => {
          if (res.code) {
            currentInstance.proxy.customMessage({
              type: 'error',
              message: res.msg,
            })
          } else {
            data.tableData = res.data.list
            console.log(1111111111, data.tableData)
          }
        })
        .catch((err) => {})
    }

    watch(
      () => props.datas,
      (newV, oldV) => {
        if (!newV.planDetail || !newV.planDetail.id) return
        getData()
      },
      { immediate: true, deep: true }
    )

    return {
      ...toRefs(data),
    }
  },
})
</script>

<style scoped>
</style>
